import Graphic from "@arcgis/core/Graphic";
import GraphicsLayer from "@arcgis/core/layers/GraphicsLayer";
import SimpleLineSymbol from "@arcgis/core/symbols/SimpleLineSymbol";
import { map,mapView } from "./map";
import * as geometryEngine from "@arcgis/core/geometry/geometryEngine.js";
import { Polyline } from "@arcgis/core/geometry";
// 创建网格线符号
let lineSymbol = new SimpleLineSymbol({
  color: [0, 0, 0, 0.5], // 设置线的颜色和透明度
  width: 0.5, // 设置线的宽度
});
const gridLayer = new GraphicsLayer();
// 创建网格线
// let xmin = -180; // 设置经度范围
// let xmax = 180;
// let ymin = -90; // 设置纬度范围
// let ymax = 90;
// let interval = 1; // 设置网格间距
// 创建网格线的图层

// export const addGrid = () => {
//   // 移除先前的网格线图形
//   gridLayer.removeAll();
//   if (gridLayer) {
//     for (let x = xmin; x <= xmax; x += interval) {
//       let geometry = {
//         type: "polyline",
//         spatialReference: SpatialReference.WGS84,
//         paths: [
//           [
//             [x, ymin],
//             [x, ymax],
//           ],
//         ], // 从南到北的竖线
//       };
//       horizontalLine = new Graphic({
//         geometry: geometry,
//         symbol: lineSymbol,
//       });
//       gridLayer.add(horizontalLine);
//     }
//     for (let y = ymin; y <= ymax; y += interval) {
//       let geometry = {
//         type: "polyline",
//         spatialReference: SpatialReference.WGS84,
//         paths: [
//           [
//             [xmin, y],
//             [xmax, y],
//           ],
//         ], // 从西到东的横线
//       };
//       verticalLine = new Graphic({
//         geometry: geometry,
//         symbol: lineSymbol,
//       });
//       gridLayer.add(verticalLine);
//     }
//     map.add(gridLayer);
//   }
// };

// 在投影坐标系下创建网格线

// export const addGrid = () => {
//   let xmin = -20000000; // 设置X轴范围
//   let xmax = 20000000;
//   let ymin = -20000000; // 设置Y轴范围
//   let ymax = 20000000;
//   let interval = 100000; // 设置网格间距
//   gridLayer.removeAll();

//   if (gridLayer) {
//     for (let x = xmin; x <= xmax; x += interval) {
//       let geometry = {
//         type: "polyline",
//         spatialReference: SpatialReference.WebMercator,
//         paths: [
//           [
//             [x, ymin],
//             [x, ymax],
//           ],
//         ], // 从南到北的竖线
//       };
//       let Hgeometry = geometryEngine.rotate(
//         geometry,
//         30,
//         new Point(
//           new Point({
//             x: x,
//             y: ymin,
//             spatialReference: SpatialReference.WebMercator,
//           })
//         )
//       );
//       horizontalLine = new Graphic({
//         geometry: Hgeometry,
//         symbol: lineSymbol,
//       });
//       gridLayer.add(horizontalLine);
//     }
//     for (let y = ymin; y <= ymax; y += interval) {
//       let geometry = {
//         type: "polyline",
//         spatialReference: SpatialReference.WebMercator,
//         paths: [
//           [
//             [xmin, y],
//             [xmax, y],
//           ],
//         ], // 从西到东的横线
//       };
//       let Vgeometry = geometryEngine.rotate(
//         geometry,
//         30,
//         new Point({
//           x: xmin,
//           y: y,
//           spatialReference: SpatialReference.WebMercator,
//         })
//       );
//       verticalLine = new Graphic({
//         geometry: Vgeometry,
//         symbol: lineSymbol,
//       });
//       gridLayer.add(verticalLine);
//     }
//     map.add(gridLayer);
//   }
// };

export const addGrid = (interval:number,rotation:number) => {
  let center = mapView.center.clone();
  let xmin = -20000000; // 设置X轴范围
  let xmax = 20000000;
  let ymin = -20000000; // 设置Y轴范围
  let ymax = 20000000;
  gridLayer.removeAll();
  for (let x = xmin; x <= xmax; x += interval) {
    const horizontalLine = new Polyline({
      paths: [
        [
          [x, ymin],
          [x, ymax],
        ],
      ],
      spatialReference: {
        wkid: 102100,
      },
    });

    const rotatedLine = geometryEngine.rotate(
      horizontalLine,
      rotation,
      center
    );

    const graphic = new Graphic({
      geometry: rotatedLine,
      symbol: lineSymbol,
    });

    gridLayer.add(graphic);
  }

  for (let y = ymin; y <= ymax; y += interval) {
    const verticalLine = new Polyline({
      paths: [
        [
          [xmin, y],
          [xmax, y],
        ],
      ],
      spatialReference: {
        wkid: 102100,
      },
    });

    const rotatedLine = geometryEngine.rotate(
      verticalLine,
      rotation,
      center
    );

    const graphic = new Graphic({
      geometry: rotatedLine,
      symbol: lineSymbol,
    });

    gridLayer.add(graphic);
  }

  map.add(gridLayer);
};

export const clearGrid = () => {
  // 移除网格
  gridLayer.removeAll();
  if (map.layers.includes(gridLayer)) {
    map.remove(gridLayer);
  }
};
